<template>
    <!-- 车辆信息维护 -->
    <div>
      <el-form ref="form" :model="form" label-width="180px">
          <div class="stepContent">
              <el-row>
                  <el-col :span="8">
                      <el-form-item label="车主姓名" prop="plate">
                          <el-input class="fullUp" v-model="form.ownName" disabled />
                      </el-form-item>
                  </el-col>
                  <el-col :span="8">
                      <el-form-item label="车主电话" prop="plate">
                          <el-input class="fullUp" v-model="form.ownerPhone" disabled />
                      </el-form-item>
                  </el-col>
                  <el-col :span="8">
                      <el-form-item label="车辆名称" prop="plate">
                          <el-input class="fullUp" v-model="form.name" disabled />
                      </el-form-item>
                  </el-col>
                  <el-col :span="8">
                      <el-form-item label="车牌号" prop="plate">
                          <el-input class="fullUp" v-model="form.plate" disabled />
                      </el-form-item>
                  </el-col>
                  <el-col :span="8">
                      <el-form-item label="车辆颜色" prop="plate">
                          <el-input class="fullUp" v-model="form.plateColor" disabled />
                      </el-form-item>
                  </el-col>
                  <el-col :span="8">
                      <el-form-item label="车辆承载吨数" prop="plate">
                          <el-input class="fullUp" v-model="form.carLoadBearing" disabled />
                      </el-form-item>
                  </el-col>
                  <el-col :span="8">
                      <el-form-item label="车辆使用状态" prop="plateColor">
                          <el-select class="fullUp" v-model="form.carUsageStatus" disabled clearable >
                              <el-option label="空闲中" value="0"></el-option>
                              <el-option label="使用中" value="1"></el-option>
                              <el-option label="维修中" value="2"></el-option>
                          </el-select>
                      </el-form-item>
                  </el-col>
                  <el-col :span="8">
                      <el-form-item label="备注" prop="cargoVolume">
                          <el-input class="fullUp" v-model="form.cargoVolume" disabled />
                      </el-form-item>
                  </el-col>
              </el-row>
              <el-row>
                  <el-col :span="12">
                      <el-form-item label="货箱照片-附件:" prop="cargoBoxPhotoAttachment">
                          <el-image v-if="form.cargoBoxPhotoAttachment" style="width: 300px; height: 300px" :src="form.cargoBoxPhotoAttachment"></el-image>
                          <!-- <file-upload v-model="form.cargoBoxPhotoAttachment"   /> -->
                      </el-form-item>
                  </el-col>
              </el-row>
          </div>
        </el-form>
        <!-- <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div> -->
    </div>
  </template>
  
  <script>
  
  import sysConstant from '@/utils/sysConstant'
  import {provinceList,cityList,areaList} from '@/api/region/region'
  
  export default {
    props: {
      form: {
        type: Object,
        default: {},
      }
    },
    dicts: ['disposal_type'],
    data() {
      return {
          activeName: 'first',
          formData: {
              // 车辆信息
              ownName: '', // 车主姓名
              ownerPhone: '', // 车主电话
              name: '', // 车辆名称
              plate: '', // 车牌号
              plateColor: '', // 车辆颜色
              carLoadBearing: '', // 车辆承载吨数
              carUsageStatus: '', // 车辆使用状态   0空闲中 1.使用中2.维修中
              contact: '', // 备注
              cargoBoxPhotoAttachment: '', // 货箱照片
          }
      }
    },
    mounted() {
    },
    beforeDestroy() {
    },
    methods: {
      handleClick(tab, event) {
          console.log(tab, event);
      },
      changeActive(){
          this.activeName = 'first'
      }
    }
  }
  </script>
  
  <style lang="scss" scoped>
    .stepContent{
    }
    .basicTitle{
      margin: 5px 0;
      font-size: 16px;
      font-weight: bold;
    }
    .dialog-footer{
      text-align: right;
    }
    .hrStyle{
      border: none; /* 移除默认的边框 */
      height: 1px; /* 设置高度 */
      background-color: #999; /* 设置颜色 */
      margin: 20px 0; /* 设置外边距 */
    }
    
    .fullUp{
      width: 100%;
      .el-input__inner{
          color: #999;
      }
    }
  
  </style>
  